<template>
    <div class="gold-shop-wrap">
      <van-nav-bar title="充值记录" left-arrow fixed @click-left="onClickLeft" />
      <div>
        <van-list
          v-model="loading"
          :finished="finished"
          finished-text="没有更多了"
          @load="onLoad"
        >
          <div class="team_list" v-for="(item, index) in fansList" :key="index">
            <div class="team_list_item">
              <!-- <img
                v-if="item.status == 120 || item.status == 110"
                src="../../images/mine/icon_fail.png"
                alt=""
              />
              <img
                v-if="item.status == 10 || item.status == 20"
                src="../../images/mine/icon_chuli.png"
                alt=""
              />
              <img
                v-if="item.status == 100"
                src="../../images/mine/icon_success.png"
                alt=""
              /> -->
              <div class="team_list_item_info">
                <div>{{ item.status_desc }}</div>
                <div>
                  {{ item.create_time }}
                </div>
              </div>
              <div class="record_money">
                <div :style="item.status==1?'color:#00C154':item.status==0?'color:#333333':'color:#F9301B'"> {{item.status==1?'+':''}}{{ item.amount }}</div>
                <!-- <div></div> -->
              </div>
            </div>
          </div>
        </van-list>
      </div>
    </div>
  </template>
  <script>
  import { VOUCHER_LIST } from "@/api/mine";
  export default {
    data() {
      return {
        finished: false,
        loading: false,
        page: 1,
        pageSize: 20,
        fansList: [],
        inviter_show: "",
        total_count: 0,
        type:this.$route.query.type,
        msg:this.$route.query.msg
      };
    },
    mounted() {
      window.scrollTo(0, 0)
    },
    methods: {
      onClickLeft() {
        this.$router.back();
      },
      onLoad() {
        let params = {};
        params["page_num"] = this.page;
        params["page_size"] = this.pageSize;
        params['type'] = this.msg==1&&this.type==0?1:this.msg==1&&this.type==1?0:this.msg==2&&this.type==0?11:10;
        // params['status'] = this.active;
        this.$http.get(VOUCHER_LIST, { params: params }).then((res) => {
          const { list } = res.data;
          this.total_count = res.data.pages.total_count;
          if (list && list.length) {
            this.page++;
            this.fansList = this.fansList.concat(list);
  
            // 加载状态结束
            this.loading = false;
            if (list.length < this.pageSize) {
              this.finished = true;
            }
          } else {
            this.finished = true;
          }
        });
      },
    },
  };
  </script>
  <style lang="scss" scoped>
  .gold-shop-wrap {
    // min-height: 100vh;
    padding-top: 46px;
    // background: #F2F4F5;
  
    ::v-deep .van-nav-bar .van-icon {
      color: #333333;
    }
  
    ::v-deep .van-nav-bar__arrow {
      font-size: 20px;
    }
  }
  
  .team_list {
    width: 95%;
    margin: 0 auto;
    margin-top: 0.2rem;
    // border: 0.01rem solid #999;
    // border-radius: 0.16rem;
    background: #fff;
  
    .team_list_item {
      display: flex;
      justify-content: space-between;
      align-items: center;
      // padding: 0.24rem 0.32rem;
      border-bottom: 1px solid #e3e3e3;
      padding: 0.2rem 0.3rem;
      img {
        width: 0.45rem;
        height: 0.45rem;
        margin-top: 0.2rem;
        margin-right: 0.2rem;
      }
  
      .team_list_item_info {
        width: 60%;
        font-size: 0.28rem;
        line-height: 0.6rem;
  
        div:first-child {
          font-family: PingFangSC, PingFang SC;
          font-weight: 600;
          font-size: 0.28rem;
          color: #333333;
          line-height: 0.4rem;
          // text-align: left;
          font-style: normal;
        }
  
        div:last-child {
          font-family: PingFangSC, PingFang SC;
          font-weight: 400;
          font-size: 0.24rem;
          color: #999999;
          // line-height: 17px;
  
          // text-align: center;
          font-style: normal;
        }
      }
  
      .record_money {
        width: 30%;
        line-height: 0.6rem;
        font-size: 0.24rem;
        text-align: right;
        div:first-child {
          font-family: PingFangSC, PingFang SC;
          font-weight: 600;
          font-size: 0.32rem;
          color: #f32a23;
          line-height: 0.4rem;
          // text-align: center;
          font-style: normal;
        }
  
        // div:last-child {
        //   font-family: PingFangSC, PingFang SC;
        //   font-weight: 400;
        //   font-size: .24rem;
        //   color: #666666;
        //   font-style: normal;
        // }
      }
    }
  }
  </style>
  